<template>
	<view class="acea-row row-middle row-between platform-datas">
		<view class="platform-item" v-for="(item,index) in platforms" :key="index" @click="toPath(item.url)">
			<text class="datas" :class="{'datas-doc':item.name!='成功案例'}"  >{{item.num}}</text>
			<view class="name">{{item.name}}</view>
		</view>
	</view>
</template>

<script>
	import {
		getStatisticsApi,
		getStatisticsListApi
	} from "@/api/api.js";
	export default {
		data() {
			return {
				platforms:[{name:'出售数量',num:0,url:'/pages/others/unusedList/unusedList?index=0'},{name:'求购数量',num:0,url:'/pages/others/unusedList/unusedList?index=1'}]

			}
		},
		mounted() {
			this.getStatisticsData();
		},
		methods: {
			//获取二手闲置数据
			async getStatisticsData() {
				try {
					let {data} = await getStatisticsListApi(this.$city);
					this.platforms[1].num = data.buy || 0;
					this.platforms[0].num = data.sale || 0;
				} catch (e) {
					//TODO handle the exception
				}
			},
			toPath(path){
				this.toPages(path)
			},
			toPages(path) {
				uni.navigateTo({
					url: path
				})
			},
		}
	}
</script>

<style lang="scss">
	// 平台数据
	.platform-datas{
		margin-bottom: 36rpx;
		 // display: grid;
		  /*  声明列的宽度  */
		  // grid-template-columns: repeat(3, 30%);
		.platform-item{
			width: 33%;
			text-align: center;
			// width: 160rpx;
			margin-bottom: 24rpx;
			.datas{
				font-size: 44rpx;
				font-weight: 700;
				color: rgba(0, 0, 0, 1);
			}
			.name{
				width: 180rpx;
				font-size: 22rpx;
				color: rgba(128, 128, 128, 1);
			}
			.datas-doc{
				padding-right: 22rpx;
				position: relative;
				display: inline-block;
				&::after{
					display: block;
					content: '＋';
					position: absolute;
					color: rgba(239, 42, 54, 1);
					font-size: 22rpx;
					top: 0;
					right: 0;
				}
			}
		}
	}
</style>